﻿<!DOCTYPE html>

<head>
<script src="jquery.js"></script>
<script src="flexible.js"></script>
    <link rel="stylesheet" href="css/swiper.min.css" />
<link rel="stylesheet" href="css/index.css" />
    <style>
        .swiper-container{
            height:10rem;
        }
    </style>
</head>

<body>
<!-- 图片加载 -->
<div id="d1">
    <div id="loading"><img src="images/timg.gif" width="70%" /></div>
</div>

<div class="all">

    <!-- Swiper -->
    <div class="swiper-container">
        <div class="swiper-wrapper" id="swiper123">
            <!--
                        <div class="swiper-slide">Slide 1</div>
                        <div class="swiper-slide">Slide 2</div>
                        <div class="swiper-slide">Slide 3</div>
                        <div class="swiper-slide">Slide 4</div>
                        <div class="swiper-slide">Slide 5</div>
            -->
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
    </div>

    <div onclick="toTop()"
    style="position:fixed;right:0.3rem;bottom:4rem;background:white"
    >回到顶部</div>

    <!--
    <div class="header" style="height:1500px;background:red;"></div>
    -->
    <div id="productList" class="clearfix">

    </div>
    <div id="loading2"
         style="text-align:center;height:1rem;display:none"
    ><img style="vertical-align: middle" src="images/timg.gif" height="90%" /> 正在加载 ...</div>
</div>

<script src="js/index.js"></script>
<script src="js/swiper.min.js"></script>
<!-- Initialize Swiper -->

<script>
    $.get('http://test.hfjava.com/pro/product_basic_info?nid=555602216181',
        {},function(data){
        for(var i=0;i<data.length;i++){
            var swiperSlideDiv = document.createElement("div");
            swiperSlideDiv.className = "swiper-slide";

            var imgEle = document.createElement("img");
            imgEle.src = "http:"+data[i];
            imgEle.style.width = "100%";

            swiperSlideDiv.appendChild(imgEle);

            swiper123.appendChild(swiperSlideDiv);

            var swiper = new Swiper('.swiper-container', {
                slidesPerView: 1,
                spaceBetween: 30,
                keyboard: {
                    enabled: true,
                },
                pagination: {
                    el: '.swiper-pagination',
                    clickable: true,
                },
                navigation: {
                    nextEl: '.swiper-button-next',
                    prevEl: '.swiper-button-prev',
                },
            });
        }
    });
</script>



</body>








